﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <link href="./css/tie.css" rel="stylesheet" type="text/css" />
    <title>Página de Rotas</title>

    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=ABQIAAAAPneRrqoFJYtoXfLD7_FUrRStiCTCFzh5HXXdOyPR0BTha56GqBQ6InazaalFgP8mzMGMErF_cMeOZA"
        type="text/javascript"></script>

    <script type="text/javascript" src="scripts/MapRoutes.js"></script>
    <script type="text/javascript" src="scripts/MapSolver.js"></script>
    
</head>
<body onload="initialize()" onunload="GUnload()">
    <table id="form_canvas" class="MyMatrix_canvas">
        <tr>
            <td>
                <!-- HEADER CONTENT /-->
                <table id="MyMatrix_header" class="MyMatrix_header">
                    <!-- First header table row /-->
                    <tr>
                        <td id="MyMatrix_headerDate">
                            <div id="MyMatrix_header_currentdate">
                                <script type="text/javascript" src="scripts/date.js"></script>
                            </div>
                        </td>
                        <td id="MyMatrix_tracker">
                            <script src="scripts/writePath.js" type="text/javascript"></script>
                            <div style="float: right;">
                                <a href="{{ URL }}">{{ URL_LinkText }}</a> {{User.nickname}}{{user}}</div>
                        </td>
                    </tr>
                    <!-- Second header table row /-->
                    <tr>
                        <td>
                            <div style="float: left;">
                                <img alt="" src="images/TieLogo.png" class="Logo" /></div>
                        </td>
                        <td>
                            <table class="boxNav" border="0" cellpadding="0" cellspacing="0">
                                <tr>
                                    <td class="celNavLeft">
                                    </td>
                                    <td width="10px">
                                        &nbsp;
                                    </td>
                                    <td id="MyMatrix_menu_1" class="celNavMenu">
                                        <a href="/loadactivities">Actividades</a>
                                    </td>
                                    <td width="50">
                                        &nbsp;
                                    </td>                                    
                                    <td id="Td2" class="celNavMenu">
                                        <a href="/loadroutes">Rotas</a>
                                    </td>                                    
                                    <td width="10">
                                        &nbsp;
                                    </td>
                                    <td id="MyMatrix_menu_2" class="celNavMenu">
                                        <a href="/loadentities">Entidades</a>
                                    </td>
                                    <td width="10">
                                        &nbsp;
                                    </td>
                                    <td id="MyMatrix_menu_3" class="celNavMenu">
                                        <a href="/loadcontacts">Contactos</a>
                                    </td>
                                    <td width="10">
                                        &nbsp;
                                    </td>
                                    <td class="celNavRight">
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
                <!-- BODY CONTENT /-->
                <table id="MyMatrix_body" class="MyMatrix_body">
                    <tr>
                        <td>
                            <div id="content">
                                <table>
                                    <tr>
                                        <td valign="top">
                                            <span class="title">Lista Actividades</span>
                                            <br /><br />
                                            <span class="titleHighlight">Gestão de Rotas</span>
                                            <br />
                                        </td>
                                    </tr>
                                </table>
                                <div class="headline">
                                    <p class="subtitle">Filtro</p> </div>
                                <!-- FLTROS /-->
                                {% if user %}
                                <form style="width:100%" action="/updateroutes" method="post">
                                <table class="EditTable">
                                    <tr>
                                        <td class="EditTable_Col6">
                                            <label for="entityCode">Entidade</label>
                                            <select class="EditField" name="entityCode" id="entityCode"">
                                                {{listEntities}}
                                            </select>
                                        </td>
                                        <td class="EditTable_Col6">
                                            <label for="contact">Contacto</label>
                                            <select class="EditField" name="contact" id="contact">
                                                {{listContacts}}
                                            </select>                                        
                                        </td>
                                        <td class="EditTable_Col6">
                                            <label for="activity">Tipo</label>
                                            <select class="EditField" name="activity" id="activity">
                                                {{listTypeActivity}}
                                            </select>                                                                                                                      
                                        </td>
                                        <td class="EditTable_Col6">
                                            <label for="priority">Prioridade</label>
                                            <select class="EditField" name="priority" id="priority">
                                                {{listPriorities}}
                                            </select>                                           
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="EditTable_Col6">
                                            <label for="dueDate">Desde Data</label>
                                            <input class="EditField" type="text" name="sinceDate" id="sinceDate" value="{{sinceDate}}" />
                                        </td>
                                        <td class="EditTable_Col6">
                                            <label for="dueDate">Até Data</label>
                                            <input class="EditField" type="text" name="toDate" id="toDate" value="{{toDate}}" />
                                        </td>                                        
                                        <td class="EditTable_Col3"><br />(dd/mm/aaaa)</td>
                                    </tr>
                                    <tr>
                                        <td colspan="5" align="left">
                                            <br />
                                            <input type="submit" value="Actualizar lista" />
                                        </td>
                                    </tr>
                                </table>
                                <br />
                                </form>
                                {% else %} 
                                    Valide-se com o seu login para ver ou manusear as actividades.
                                {% endif%}                                
                                <table border="0" cellspacing="0" cellpadding="0">
                                    <tr>
                                        <td class="celSepHColorLeft"></td> 
                                        <td class="celSepHColorCenter"></td>
                                        <td class="celSepHColorRight"></td>
                                    </tr>
                                </table>
                                {% if NumberActivities %}
                                <form id="formActivities" style="width:100%" action="javascript:directions(document.forms['formActivities'].caminhar.checked, document.forms['formActivities'].semAutoEstradas.checked)" method="post">
                                    <table class="ListTable" id="routeTable">
                                        <tr>
                                            <th>Sel.</th>
                                            <th>Resumo</th>
                                            <th>Data Activ.</th>
                                            <th>Actividade</th>
                                            <th>Entidade</th>
                                            <th>Contacto</th>
                                            <th>Prioridade</th>
                                            <th>Lat./Lng.</th>
                                        </tr>
                                        {% for activity in Activities %}
                                        <tr>
                                            <td><input type="checkbox" /></td>
                                            <td>
                                                {{activity.shortDescription}}
                                            </td>
                                            <td>
                                                {{activity.dueDate|date:"d.m.Y"}}
                                            </td>
                                            <td>
                                                {{activity.activity}}
                                            </td>
                                            <td><a title="{{activity.entityCode.EntityAbbr}}" class="MyLink" href="/loadentities?id={{activity.entityCode.key.id}}">{{activity.entityCode.EntityAbbr}}</a></td>
                                            <td><a title="{{activity.contact.Name}}" class="MyLink" href="/loadcontacts?id={{activity.contact.key.id}}">{{activity.contact.Name}}</a></td>
                                            <td>
                                                {{activity.priority}}
                                            </td>
                                            <td>
                                                <a class="MyLink" target="_blank" title="{{activity.entityCode.LatLng}}" href="http://maps.google.pt/maps?utm_campaign=pt&utm_medium=ha&utm_source=pt-ha-emea-pt-bk-gm&utm_term=google%20maps&q={{activity.entityCode.LatLng}}">Mapa</a>
                                            </td>
                                        </tr>
                                        {% endfor %}
                                    </table>
                                    <hr />
                                    <p style="text-align:right; font-size:smaller">
                                        Número total de actividades: {{NumberActivities}}
                                    </p>
                                    <table>                                   
                                        <tr>
                                            <td style="width:100px">
                                                <input type="submit" value="Actualizar rota" />
                                            </td>
                                            <td style="text-align:left">
                                                <input id="caminhar" type="checkbox"/>
                                                Caminhar 
                                                <br />
                                                <input id="semAutoEstradas" type="checkbox"/>
                                                Evitar auto-estradas
                                            </td>
                                        </tr>
                                    </table>
                                </form>
                                {% endif %}                                                                
                            </div>
                        </td>
                    </tr>
                    {% if user %}
                    <tr>
                        <td>
                            <div>
                                <table>
                                    <tr>
                                        <td>
                                            <div id="map" style="width:600px; height:450px"></div>
                                        </td>
                                        <td  width = "360" valign="top" >                                            
                                            <div style="height:450px;background-color:ButtonFace">
                                                <div id="routeTitle" style="height:10px;text-align:left;font-weight:bold">  Itinerário</div>                                            
                                                <div id="path" style="height:40px;text-align:left;vertical-align:top;background-color:ButtonFace"></div>                                            
                                                <div id="directions" style="overflow:auto;width:350px; height:380px;background-color:ButtonFace"></div>
                                            </div>
                                        </td>
                                     </tr>
                                </table>
                            </div>
                        </td>
                    </tr>
                    {% endif %}
                </table>
                <!-- FOOTER CONTENT -->
                <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
                    <tr>
                        <td id="Td1" class="MyMatrix_footer">
                                <script src="scripts/PageLayout.js" type="text/javascript"></script>                            
                        </td>
                    </tr>
                </table>
                <!-- BASEBOARD-->
                <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" class="boxBaseboard">
                    <tr>
                        <td class="baseboard_left">
                            &nbsp;
                        </td>
                        <td class="baseboard_center">
                            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="baseboard_txt">
                                <tr>
                                    <td style="text-align: left; width: 140px;">
                                        <img src="images/IPCALogo.png" alt="IPCA Logo" />
                                    </td>
                                    <td>
                                        <b>(Nuno Queirós - António Antunes - Miguel Barroso)
                                            <br />

                                            <script type="text/javascript" src="./Scripts/Year.js"></script>

                                            © IPCA</b> . Todos os Direitos Reservados.
                                    </td>
                                </tr>
                            </table>
                        </td>
                        <td class="baseboard_right">
                            &nbsp;
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</body>
</html>
